<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" class="userId">
    <input type="button" value="获取用户信息" class="find">
    <script>
        document.querySelector('.find').onclick = function(){
            // 获取input中内容
            let id = document.querySelector('.userId').value;
            // 1、获取对象
            let xhr = new XMLHttpRequest;
            // 2、使用open方法完成连接建立
            // xhr.open(method,url,async) method表示请求方式   url表示请求地址 async表示是否异步 默认为true表示异步
            xhr.open('GET','http://127.0.0.1/WWW/day未知数/7月18日js系/one.php?id='+id);
            // 3、调用send方法完成发送请求 send方法中可以传递参数 参数表示是请求体中携带的数据
            xhr.send();
            // 4、监听状态的改变
            xhr.onreadystatechange = function(){
                if(xhr.readyState == 4 && xhr.status == 200){
                    console.log(xhr.responseText);
                    console.log(JSON.parse(xhr.responseText));
                }
            }

            
        }
    </script>
</body>
</html>